<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<script type="text/javascript">
window.onload=function(){
	var yh = [];
	var yh = [{id:1,account:'123',password:'123'},{id:2,account:'789',password:'789'},{id:3,account:'456',password:'456'}]
	var x = document.getElementById('zh-1')
	var dl = document.getElementById('dl');
	var u = document.getElementById('zh2-1');
	var c = document.getElementById('zh-2');
	var d = document.getElementById('zh2-2');
	var dj = document.getElementById('dj');
	var bj = document.getElementById('bj');
	var b = document.getElementById('fff');
	var a = document.getElementById('eee');
	var bf = document.getElementById('bfx');
	var butt = document.getElementById('ks');
	var kuang = document.getElementById('asd');
	var che = document.getElementById('a');
	var che2 = document.getElementById('b');
	var che3 = document.getElementById('c');
	var che4 = document.getElementById('d');
	var che5 = document.getElementById('e');
	var yuan = document.getElementById('bm1');
	var yuan2 = document.getElementById('bm2');
	var yuan3 = document.getElementById('bm3');
	var yuan4 = document.getElementById('bm4');
	var yuan5 = document.getElementById('bm5');
	var tu1 = document.getElementById('ys1');
	var tu2 = document.getElementById('ys2');
	var tu3 = document.getElementById('ys3');
	var tu4 = document.getElementById('ys4');
	var tu5 = document.getElementById('ys5');
	yuan.onmousemove=function(){
		che.style.display='block'
		tu1.style.display='block'
		}
	che.onmouseout=function(){
		che.style.display='none'
		tu1.style.display='none'
		}
	yuan2.onmousemove=function(){
		che2.style.display='block'
		tu2.style.display='block'
		}
	che2.onmouseout=function(){
		che2.style.display='none'
		tu2.style.display='none'
		}
	yuan3.onmousemove=function(){
		che3.style.display='block'
		tu3.style.display='block'
		}
	che3.onmouseout=function(){
		che3.style.display='none'
		tu3.style.display='none'
		}
	yuan4.onmousemove=function(){
		che4.style.display='block'
		tu4.style.display='block'
		}
	che4.onmouseout=function(){
		che4.style.display='none'
		tu4.style.display='none'
		}
	yuan5.onmousemove=function(){
		che5.style.display='block'
		tu5.style.display='block'
		}
	che5.onmouseout=function(){
		che5.style.display='none'
		tu5.style.display='none'
		}
	b.onclick=function(){
		a.style.display='none'
		dl.style.display='block'
		}
	butt.onclick=function(){
		kuang.style.display='block'
		}
	x.onclick=function(){
		if(x.value=='请输入账号')
		{
		x.value="";
		}
		}
	c.onclick=function(){
		if(c.value='请输入密码')
		{
			c.value="";
			}
		
		}
	dj.onclick=function()
	{
		if(x.value==""||x.value=="请输入账号")
		{
			u.style.visibility='visible'
			}else
			{
				u.style.visibility='hidden'
				}
		if(c.value==""||c.value=="请输入密码")
		{
			d.style.visibility='visible'
			}else
			{
				d.style.visibility='hidden'
				}
				for(var i=0;i<yh.length;i++)
				{
					if(yh[i].account==x.value&&yh[i].account==c.value){
						alert('登录成功')
						dl.style.display='none'
						butt.style.display='block'
						bf.style.transform='rotateX(40deg)'
						
						return
						}
						
					}
					alert('请输入正确的账号和密码')
		}
}
</script>
<body>

<div class="qqq">
<div id="bfx"></div>
<div id="ks"><p>BUTTON</p></div>
</div>
<div class="www"><p>力量、速度和豪华融为一体</p></div>
<div id="eee">
<div id="fff"></div>

</div>
<div id="asd">
<header id="bm1"></header>
<header id="bm2"></header>
<header id="bm3"></header>
<header id="bm4"></header>
<header id="bm5"></header>
</div>
<a href="#" id="a"><div class="bx"><p>奥迪</p></div></a>
<a href="fuye.html" id="b"><div class="bx"><p>兰博基尼</p></div></a>
<a href="#" id="c"><div class="bx"><p>法拉利</p></div></a>
<a href="#" id="d"><div class="bx"><p>玛莎拉蒂</p></div></a>
<a href="#" id="e"><div class="bx"><p>布加迪</p></div></a>
<div id="ys1"></div>
<div id="ys2"></div>
<div id="ys3"></div>
<div id="ys4"></div>
<div id="ys5"></div>
<div id="dl">
<p class="lol">账号</p><input id="zh-1" type="text" value="请输入账号" /><p id="zh2-1">账号不能为空</p>
<p class="lol">密码</p><input id="zh-2" type="text" value="请输入密码" /><p id="zh2-2">密码不能为空</p>
<input type="button" value="登录" id="dj" />
<input type="button" value="" id="dj" />
</div>
</body>
</html>
